import { BrowserRouter as Router, Route, Switch, Redirect } from "react-router-dom"
import React, { Component, lazy, Suspense } from 'react'
import config from "./config"
import RouteHook from "./RouteHook"
import Loading from "./Loading"
// var _import = (page) => lazy(() => import(`@/pages/${page}`))
export default class index extends Component {
  render() {
    return (
      <div>
        <Router basename={config.basename}>
          <Suspense fallback={<Loading spinning={true} />}>
            <Switch>
              {
                myRoute(config.routes)
              }
              <Route render={() => <Redirect to={"/404"} />} />
            </Switch>
          </Suspense>
        </Router>
      </div>
    )
  }
}
function myRoute(routes) {
  if (routes && routes.length) {
    return routes.map((item, index) => {
      return <Route
        exact={item.exact || false}
        path={item.path}
        key={item.path || index}
        render={props => {
          return item.render || item.render ? item.render() : <RouteHook RouteCom={item.component} beforeEach={config.beforeEach} meta={item.meta || {}} {...props}>
            <Switch>
              {
                myRoute(item.children)
              }
              <Route render={() => <Redirect to={"/404"} />} />
            </Switch>
          </RouteHook>
        }}
      ></Route>
    })
  } else {
    return ""
  }
}
